<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:p="http://xmlns.jcp.org/jsf/passthrough">

    <ui:composition template="/template.xhtml">
        <ui:define name="title">
            <h:outputLabel value="#{messages.Student}"></h:outputLabel>
        </ui:define>
        <ui:define name="body">
            <h:form styleClass="jsfcrud_list_form" id="form1">
                <h:panelGrid columns="2" >
                    <h:outputLabel value="#{messages.School}"   dir="RTL"/>
                    <h:selectOneMenu value="#{schoolController.selected}" 
                                     required="true" requiredMessage="#{messages.School}" immediate="true">
                        <f:selectItem itemLabel="#{messages.Please} #{messages.Select}" />
                        <f:selectItems value="#{schoolControllerA.schoolsOnLeaves}"/>
                    </h:selectOneMenu>
                    <h:outputLabel value="#{messages.Account}"   dir="RTL"/>
                    <h:inputText  value="#{studentController.selected.name}" title="#{messages.Name}" required="true" requiredMessage="#{messages.Name}"/>
                    <h:outputLabel value="#{messages.Firstname}"   dir="RTL" />
                    <h:inputText value="#{studentController.selected.firstname}" title="#{messages.Firstname}" />
                    <h:outputLabel value="#{messages.Secondname}"    dir="RTL"/>
                    <h:inputText value="#{studentController.selected.secondname}" title="#{messages.Secondname}" />
                    <h:outputLabel value="#{messages.Email}"   dir="RTL"/>
                    <h:inputText value="#{studentController.selected.email}"  title="#{messages.Email}" ><!--p:type="email"-->
                        
                    </h:inputText>
                    <h:outputLabel value="#{messages.Phone}"  dir="RTL"/>
                    <h:inputText id="telephone" value="#{studentController.selected.phone}" title="#{messages.Phone}" ><!--p:type="phone"-->
                    </h:inputText>
                    <h:outputLabel value="#{messages.Password}"   dir="RTL"/>
                    <h:inputSecret value="#{studentController.selected.password}" id="pwd1" />
                    <h:outputLabel value="#{messages.Reinput}#{messages.New}#{messages.Password}"  dir="RTL"/>
                    <h:inputSecret required="true" onkeyup="validate()" id="pwd2"/>
                    <h:outputLabel /><h:outputLabel id="tell"></h:outputLabel>

                    <h:commandButton action="#{studentController.create}" value="#{messages.Save}" />
                </h:panelGrid>
                <script>
                    function validate() {
                        var pwd1 = document.getElementById("form1.pwd1").value;
                        var pwd2 = document.getElementById("form1.pwd2").value;
<!-- 对比两次输入的密码 -->
                        if (pwd1 !== pwd2) {
                            document.getElementById("form1.tell").innerHTML = "<font color='red'>两次密码不相同</font>";
                        }
                    }
                </script>
            </h:form>
        </ui:define>
    </ui:composition>

</html>
